<template>
	<view class="shift-duty-item">
		<view>
			<view class="shift-duty-hd">
				<image src="/static/images/team-or-group/icon-person.png" />
				<text>{{ data.deptName }}</text>
			</view>
			<view class="shift-duty-row">
				<text>编号:</text><text>{{ data.changeShiftInfoCode }}</text>
			</view>
			<view class="shift-duty-row">
				<text>交班时间:</text><text>{{ data.handoverTime }}</text>
			</view>
			<view class="shift-duty-row">
				<text>交班班次:</text><text>{{ data.handoverClassName }}</text>
			</view>
			<view class="shift-duty-row">
				<text>交班班长:</text><text>{{ data.handoverUserName }}</text>
			</view>
			<view class="shift-duty-row">
				<text>接班班组:</text><text>{{ data.takeoverDeptName }}</text>
			</view>
			<view class="shift-duty-row">
				<text>接班班长:</text><text>{{ data.takeoverUserName }}</text>
			</view>
		</view>
		<view class="shift-duty-bottom">
			<view class="shift-duty-row">
				<view class="flex" v-if="type == 1">
					<text>当前节点:</text>
					<text>{{ data.flowNodeStr }}</text>
				</view>
			</view>
			<view class="shift-duty-bottom-btn-group">
				<view class="shift-duty-btn shift-duty-btn-active" @click="handleRead">查看</view>
				<view class="shift-duty-btn" v-if="data.dealWith === 'Y' && type == 1" @click="handleSignIn">
					{{data.flowNode == 0 ? '重新申请':'确认'}}</view>
			</view>
		</view>
	</view>
</template>
<script>
	export default {
		props: {
			data: {
				type: Object,
				default: () => ({})
			},
			type: {
				type: Number,
				default: 1
			}
		},
		methods: {
			handleSignIn() {
				uni.navigateTo({
					url: '/pages/work/team-or-group/shifting-handle/index?id=' + this.data.changeShiftInfoId +
						'&node=' + this.data.flowNode + '&taskId=' + this.data.processTaskId
				});
			},
			handleRead() {
				uni.navigateTo({
					url: '/pages/work/team-or-group/shifting-duty-record/index?id=' + this.data.changeShiftInfoId
				});
			},
			getNode() {

			}
		},
		computed: {
			isCurrentMeeting() {
				return this.type === 1
			}
		}
	}
</script>
<style lang="scss" scoped>
	.shift-duty-item {
		width: 690rpx;
		height: 562rpx;
		background: #FFFFFF;
		border-radius: 20rpx 20rpx 20rpx 20rpx;
		opacity: 1;
		margin: 0 auto;
		padding: 30rpx 30rpx 20rpx 30rpx;
		font-size: 28rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
	}

	.shift-duty-item>view>view {
		display: flex;
		align-items: center;
	}

	.shift-duty-hd {
		font-weight: bold;
		font-size: 34rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		color: #333333;
		height: 52rpx;
		margin-bottom: 20rpx;
		@include text-overflow-ellipsis(1);

		image {
			width: 52rpx;
			height: 52rpx;
			margin-right: 18rpx;
		}
	}

	.shift-duty-row {
		color: #999999;
		margin-bottom: 20rpx;

		text {
			display: inline-block;
		}

		text:first-child {
			width: 140rpx;
			text-align: right;
			margin-right: 12rpx;
		}

		text:last-child {
			color: #333333;
			flex: 1;
			@include text-overflow-ellipsis(1);
		}
	}

	.shift-duty-bottom {
		border-top: 1rpx solid #D5D7E3;
		display: flex;
		align-items: center;
		padding-top: 20rpx;
		justify-content: space-between;

		.shift-duty-row {
			margin-bottom: 0;
		}
	}

	.shift-duty-bottom-btn-group {
		display: flex;
		align-items: center;

		.shift-duty-btn {
			width: 140rpx;
			height: 60rpx;
			border-radius: 32rpx 32rpx 32rpx 32rpx;
			opacity: 1;
			border: 1rpx solid #C87C32;
			font-size: 28rpx;
			color: #C87C32;
			text-align: center;
			line-height: 60rpx;
		}

		.shift-duty-btn-active {
			color: #454A5E;
			border-color: #454A5E;
			margin-right: 20rpx;
		}
	}
</style>